<template>
	<view id="view">
		<view v-if="allowAccess" style="padding-top: 20upx; width: 200px;margin: 0 auto;">
			<u-qrcode  canvas-id="qrcode"
					   value="uQRCode" 
					   size="200"
					   :options="{background:{color:'rgba(0,0,0,0)'},foreground:{color:'#fff'}}">
			</u-qrcode>
		</view>
		<view v-if="allowAccess" style="text-align: center;color: white;margin-top: 20upx;">
			<view style="font-size: 30px;font-weight: 1000;" 
				   v-text="utils.timeString(nowTime)">
			</view>
			<view style="font-size: 26px;font-weight: 1000;"
				   v-text="'正常通行'">
			</view>
		</view>
		<view v-else style="text-align: center;color: white;padding-top: 100upx;">
			<view style="font-size: 26px;font-weight: 1000;"
				   v-text="'你暂不符合出行要求'">
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				allowAccess:false,
				nowTime:new Date()
			}
		},
		onLoad() {
			const that = this
			setInterval(function(){
				that.nowTime = new Date()
			},1000)
			that.API({
				showLoading:true,
				url:'/user/access',
				code0:function(res){
					that.allowAccess = res.data.data
				}
			})
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	#view{
		height: 100vh;
		background-color: var(--theme-color);
	}
</style>

